<template>
	<div id="personInfoField">
		<van-field
			v-model="name"
			clearable			
			name="name"
			label="姓名"
			placeholder="请输入姓名(可不填)"			
		/>
        <van-field
			v-model="sex"
			is-link
			readonly
			name="sex"
			@click="showSex = true"
			label="性别"
			placeholder="请选择性别(可不选)"
			
			
		/>
		<van-popup v-model="showSex" round position="bottom">
			<van-picker
				title="请选择性别"
				show-toolbar
				:columns="colSex"
				@close="showSex = false"
				@confirm="onConfirmSex"
				@cancel="onCancel"
			/>
		</van-popup>
        <van-field
			v-model="school"
			is-link
			readonly
			name="school"
			@click="showSchool = true"
			label="学校"
			placeholder="请选择学校(可不选)"
			
			
		/>
		<van-popup v-model="showSchool" round position="bottom">
			<van-picker
				title="请选择学校"
				show-toolbar
				:columns="colSchool"
				@close="showSchool = false"
				@confirm="onConfirmSchool"
				@cancel="onCancel"
			/>
		</van-popup>

		<van-field
			v-model="college"
			is-link
			readonly
			name="college"
			@click="onClickCollege"
			label="学院"
			placeholder="请选择学院(可不选)"
			
			
		/>
		<van-popup v-model="showCollege" round position="bottom">
			<van-picker
				title="请选择学院"
				show-toolbar
				:columns="colCollege"
				@close="showCollege = false"
				@confirm="onConfirmCollege"
				@cancel="onCancel"
			/>
		</van-popup>
        
        <van-field
			v-model="no"
			clearable			
			name="no"
			label="学号/工号"
			placeholder="请输入学号/工号(可不填)"			
		/>
	</div>
</template>

<script>
// import { sendRegisterCode } from '@/api/register.js';
// import { sendforgetPswCode } from '@/api/passwd.js';changePersonInfo
import { viewSchool, viewCollege } from '@/api/school.js';
import { changePersonInfo ,viewPersonInfo} from '@/api/person.js';
import { dict } from '@/api/dict.js';
import { Toast } from 'vant';
export default {
	name: 'personInfoField',
	data() {
		return {
			name: null,
            sex: null,
            school: null,
            college: null,
            no: null,
            showSchool : false, // 展示学校的选择器
			showCollege : false, // 展示学院的选择器
            showSex : false, // 展示性别的选择器
            colSchool: [],
            colSchoolId: [],
            colCollege: [],
            colCollegeId: [],
            colSex: [],
            colSexCode: [],
            sexIndex: -1,
            schoolIndex: -1,     // 数组下标 根据学校名用来找对应的schoolId  和 找对应的collegeId！！
			collegeIndex: -1     // 数组下标 根据学校名用来找对应的schoolId  和 找对应的collegeId！！
		}
	},
	props: {
		
	},
    async created() {
        await viewSchool(1,20).then(res => {
            const info = res.data.data.records;  
            console.log(res.data.data);          
            for(let i of info) {                
                this.colSchool.push(i.name);
                this.colSchoolId.push(i.id);
            }
        }).catch(err => {
            console.log(err);
        });

        await dict('sex').then(DictRes => {            
            if(DictRes.data.code === 0) {
                for(let d of DictRes.data.data) {
                    this.colSex.push(d.info);
                    this.colSexCode.push(d.code);
                }
            }
        }        
        ).catch(err => console.log(err))
    },
	methods: {		
        onCancel() {  //  点击了选择器的取消            
            this.showSchool = false;
            this.showCollege = false;
            this.showSex = false;
        },
        onConfirmSex(value, index) {            
            this.sex = value;
            this.showSex = false;
            this.sexIndex = index;
        },
        onConfirmSchool(value, index) {
             // 换了一个大学
            this.college = '';
            this.collegeIndex = -1;
            
            this.school = value;
            this.showSchool = false;
            this.schoolIndex = index;
        },
        onConfirmCollege(value, index) {
            this.college = value;
            this.collegeIndex = index;
            this.showCollege = false;
        },
        async onClickCollege() {
            this.colCollege = [];
            this.colCollegeId = [];
            // 请求school 列表
            if(this.schoolIndex === -1) { // 未选择学校
                this.colCollege.push('无');
            } else { // 选择了学校
                await viewCollege(1,20,this.colSchoolId[this.schoolIndex]).then(res => {
                    const info = res.data.data.records;
                    console.log(info);
                    for(let i of info) {
                        this.colCollege.push(i.name);
                        this.colCollegeId.push(i.id);
                    }
                }).catch(err => {
                    console.log(err);
                });
            }
            
            this.showCollege = true
            
        },
        isNotSetPersonInfo() {
            if(this.name==='' && this.no==="" && this.sexIndex===-1  && this.schoolIndex === -1) return true;
            else return false;
        },
        async onChangePersonInfo() {
            console.log(1,this.name,2,this.no,3,this.sexIndex,4,this.collegeIndex , 5,this.schoolIndex);
            if(this.isNotSetPersonInfo()) {
                Toast('无修改内容');
            } else {
                const personInfo = {
                    //"collegeId": this.college,
                    //"schoolId": this.school,
                    "name": this.name!=''?this.name:null,
                    "no": this.no!=''?this.no:null,                
                    "sex": this.sexIndex === -1?null:this.colSexCode[this.sexIndex],
                    "organId": this.collegeIndex === -1?(this.schoolIndex===-1?null:this.colSchoolId[this.schoolIndex]):this.colCollegeId[this.collegeIndex]
                }
                console.log(personInfo);
                await changePersonInfo(personInfo).then(res => {
                    console.log(res);
                    if(res.data.code === 0) {
                        console.log('修改个人信息成功');                    
                        this.changeLocalPersonInfo();
                    } else if(res.data.code === 1002){
                        Toast("填写的信息无效，请重新填写");
                    } else {
                        Toast(res.data.msg);
                    }
                }).catch(err => console.log(err));
            }
            
        },
        async changeLocalPersonInfo() {
            let userInfo = JSON.parse(localStorage.getItem('userInfo'));
            await viewPersonInfo().then(res => {
                if(res.data.code === 0) {
                    console.log(res.data.data);
                    userInfo.no = res.data.data.no;
                    userInfo.name = res.data.data.name;                    
                    userInfo.school = res.data.data.school;
                    userInfo.college = res.data.data.college;        

                    for(let c of this.colSexCode.keys()) {
                        if(res.data.data.sex === this.colSexCode[c]) {
                            userInfo.sex = this.colSex[c];
                        }
                    }                    

                    console.log(userInfo);                    
                    localStorage.setItem('userInfo' , JSON.stringify(userInfo));
                    this.$emit('toParent', 'changeSucceed');
                } else {
                    Toast(res.data.msg);
                }
            }).catch(err => console.log(err))
        }	
	},
}	
</script>

<style>
</style>